import { defineComponent } from "vue";
import ProTable from "@/components/ProTable/index.vue";
import { getHistorysystem } from "@/api/modules/iot/device";
export default defineComponent({
	props: {
		detail: {
			type: Object,
			default() {
				return {};
			}
		}
	},
	emits: [],
	setup(props) {
		const proTable = ref();
		const initParam = reactive({
			pageIndex: 0,
			pageSize: 10,
			keyType: "system",
			key: "event",
			timeOrder: "desc"
		});
		const columns = reactive<any>([
			{ prop: "updateTime", label: "日志时间", width: 200 },
			{ prop: "level", label: "日志级别", width: 100 },
			{ prop: "type", label: "日志类型", width: 100 },
			{ prop: "reason", label: "日志原因" },
			{ prop: "solution", label: "解决方式" }
		]);
		const dataCallback = (data: any) => {
			return {
				datalist: data.records,
				total: data.total || 0,
				pageIndex: data.current,
				pageSize: data.size
			};
		};
		const getTableList = async (params: any) => {
			console.log(props.detail.sn);
			return getHistorysystem({ ...params, idSn: props.detail.sn });
		};
		return () => {
			return (
				<ProTable
					ref={proTable}
					showHeader={false}
					columns={columns}
					initParam={initParam}
					title={"事件日志"}
					requestApi={getTableList}
					dataCallback={dataCallback}
				>
					{{
						level: (scope: any) => {
							return <div>{scope.row.value.level}</div>;
						},
						type: (scope: any) => {
							return <div>{scope.row.value.type}</div>;
						},
						reason: (scope: any) => {
							return <div>{scope.row.value.reason}</div>;
						},
						solution: (scope: any) => {
							return <div>{scope.row.value.solution}</div>;
						}
					}}
				</ProTable>
			);
		};
	}
});
